import 'package:flutter/material.dart';
import 'package:flutter_application_1/config/app_colors.dart';
import 'package:flutter_application_1/view/root_pages/home_page.dart';
import 'package:flutter_application_1/view/root_pages/music_page.dart';
import 'package:flutter_application_1/view/root_pages/profile.dart';
import 'package:flutter_application_1/view/root_pages/tiny_video.dart';
import 'package:proste_indexed_stack/proste_indexed_stack.dart';

class RootPage extends StatefulWidget {
  const RootPage({Key? key}) : super(key: key);

  @override
  _RootPageState createState() => _RootPageState();
}

const Map<String, String> _bottomNames = {
  "home": "首页",
  "music": "音乐",
  "create_media": "",
  "tiny_video": "小视频",
  "profile": "我的"
};

class _RootPageState extends State<RootPage> {
  int _currentIndex = 0;
  //底部导航栏数组
  final List<BottomNavigationBarItem> _bottomNavBarList = [];
  final List<IndexedStackChild> _page = [
    IndexedStackChild(child: HomePage()),
    IndexedStackChild(child: MusicPage()),
    IndexedStackChild(child: Container()),
    IndexedStackChild(child: ProfilePage()),
    IndexedStackChild(child: TinyVideo()),
  ];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _bottomNames.forEach((key, value) {
      _bottomNavBarList.add(_bottomNavigationBarItem(key, value));
    });
  }

  void _onTabClick(int index) {
    setState(() {
      _currentIndex = index;
    });
  }

  void _createMedia() {
    print("createMedia");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ProsteIndexedStack(
        index: _currentIndex,
        children: _page,
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: _bottomNavBarList,
        currentIndex: _currentIndex,
        onTap: _onTabClick,
        type: BottomNavigationBarType.fixed,
      ),
      floatingActionButton: _createMediaButton(),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
    );
  }

  Widget _createMediaButton() {
    return Container(
      width: 43,
      height: 43,
      margin: const EdgeInsets.only(top: 56),
      child: FloatingActionButton(
        backgroundColor: AppColors.nav,
        onPressed: _createMedia,
        child: Image.asset(
          "assets/images/icons/create_media.png",
        ),
      ),
    );
  }

  BottomNavigationBarItem _bottomNavigationBarItem(String key, String value) {
    return BottomNavigationBarItem(
        icon: Image.asset(
          "assets/images/icons/$key.png",
          width: 24,
          height: 24,
        ),
        activeIcon: Image.asset(
          "assets/images/icons/${key}_active.png",
          width: 24,
          height: 24,
        ),
        label: value,
        tooltip: "");
  }
}
